<template>
    <el-row :gutter="20">
        <el-col :span="6" :xs="24">
            <el-card class="card">
                <div slot="header">未绑定信息用户</div>
                <div class="count">{{ data.notBindInfo | fmtMoney }}</div>
                
            </el-card>
        </el-col>
        <el-col :span="6" :xs="24">
            <el-card class="card">
                <div slot="header">今日未签到用户</div>
                <div class="count">{{ data.notClock | fmtMoney}}</div>
            </el-card>
        </el-col>
        <el-col :span="6" :xs="24">
            <el-card class="card">
                <div slot="header">未处理投诉</div>
                <div class="count">{{ data.notHandlerFeedback | fmtMoney}}</div>
                
            </el-card>
        </el-col>
        <el-col :span="6" :xs="24">
            <el-card class="card">
                <div slot="header">未签约客户</div>
                <div class="count">{{ data.notSignUsre | fmtMoney}}</div>
            </el-card>
        </el-col>
    </el-row>
</template>

<script>
import request from '@/utils/request'
export default {
    data() {
        return {
            data: {}
        }
    },
    mounted() {
        this.load()
    },
    methods: {
        async load() {
            this.data = await request.get(`admin/count1`)
        }
    }
}
</script>

<style lang="scss" scoped>
.count{font-size: 24px; font-weight: 500;}
.card{
    position: relative;
    margin-top: 15px;
}
img{
    position: absolute;
    width: 40px;
    height: 40px;
    right: 20px;
    bottom: 50px;
}
.bottom{
    margin-top: 14px;
    display: flex;
    justify-content: space-between;
    
}
</style>